<template>
	<view class="items"  @click="jumpHouseDetails(item.id)">
		<!-- item.imgs -->
		<image style="width: 200rpx; margin: 0 auto; display: block" mode="widthFix" src="/static/house.jpg" @error="imageError"></image>
		<!-- <view class="title">{{item.district}},{{item.acreage}}平米，{{item.room}}室{{item.room}}厅{{item.room}}卫</view> -->
		<view class="title">{{ item.pro_name }}</view>
		<view class="bottom">
			<view class="price">
				<span>￥{{ item.price }}</span>
				/起
			</view>
			<image style="width: 44rpx" mode="widthFix" src="/static/index/gwc.png" @error="imageError"></image>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			
			houseList:[]
		};
	},
	props:{
		item:{
			type:Object,
			default:{}
		}
	},
	methods: {
		// 跳转房屋详情
		jumpHouseDetails(id) {
			console.log(id);
			uni.navigateTo({
				url: `/pages/houseDetails/houseDetails?proId=${id}`
			});
		}
	}
};
</script>

<style scoped lang="scss">
.items {
	// width: calc(50% - 30rpx);
	// width: 50%;
	// background-color: #fff;
	// border-radius: 16rpx;
	// padding: 30rpx 16rpx;

	// margin-right: 30rpx;
	// margin-bottom: 24rpx;
	// image{
	// 	margin: 0 auto;
	// 	display: block;
	// }
	.title {
		color: #333333;
		font-size: 28rpx;
		font-weight: 500;
		margin-top: 30rpx;
		 height: 80rpx; /* 设置两行的高度 */
		  overflow: hidden; /* 隐藏超出高度的内容 */
		  display: -webkit-box; /* 使用弹性盒子布局 */
		  -webkit-box-orient: vertical; /* 设置为垂直方向排列 */
		  -webkit-line-clamp: 2; /* 指定显示的行数 */
		  text-overflow: ellipsis; /* 显示省略号 */;
	}
	.bottom {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 22rpx;
		color: #999999;
		margin-top: 20rpx;
		.price {
			span {
				font-size: 32rpx;
				color: #f55726;
				font-weight: bold;
				display: inline-block;
				margin-right: 5rpx;
			}
		}
	}
}
</style>
